<template>
	<view id="content">
		<view class="steps">
		<uni-steps :options="list1" active-color="#007AFF" :active="active" />
		<view>
			<view>
					<view class="uni-form-item uni-column">
						<view class="picker">
							<picker @change="getCourse" :range="array" v-model="order.courseId-1"  style="font-size:20px;"><!--@change用于获取下拉框改变的值，:range用于循环遍历array数组将数组内容循环-->
								<label>办理课程</label>
								<label class="" style="font-size:20px;margin-left: 10px;">{{array[order.courseId-1]}}</label>		<!--循环array数组index为索引-->
							</picker>
						</view>
						<view class="picker">
							<picker @change="getWayName" :range="arrayWayName" v-model="order.wayId" style="font-size:20px;"><!--@change用于获取下拉框改变的值，:range用于循环遍历array数组将数组内容循环-->
								<label>支付方式</label>
								<label class="" style="font-size:20px;margin-left: 10px;">{{arrayWayName[order.wayId]}}</label>		<!--循环array数组index为索引-->
							</picker>
						</view>
						<view class="picker" style="font-size:20px;">
							<label>订单金额</label>
							<input type="text" name="orderAmount" v-model="course.coursePrice" placeholder="请输入订单金额">
						</view>
						<view class="picker" style="font-size:20px;">
							<label>支付金额</label>
							<input type="text" name="wayAmount" v-model="course.coursePrice" placeholder="请输入支付金额">
						</view>
					</view>
					<view class="uni-btn-v">
						<button form-type="submit" class="button-green" @click="submit()">确认报名</button>
					</view>
			</view>
		</view>
		</view>
	</view>
</template>
<script>
	import {getAllCourse,getCourseById} from '../../../api/course.js'
	import {getAllOrderWay} from '../../../api/orderWay.js'
	import {stuRegister} from"../../../api/student.js"
	import {addYsOrder} from"../../../api/order.js"
	export default {
		data() {
			return {
				array:['请选择','中故宫'],
				arrayWayName:['请选择','中故宫'],
				course:{
					coursePrice:100
				},
				student:{
					studentId:0
				},
				index:0,//给上边的声明的index变量
				indexWayName:0,//给上边声明的index变量
				order:{
					courseId:1,
					orderPrice:0,
					wayPrice:0,
					wayId:1,
					userId:0,
					studentId:0
				},
				active:2,
					list1:[
						{title: '学员信息'},
						{title: '补充信息'},
						{title: '报名/试听'},
				]
			}
		},
		onLoad(option) {
			this.student=JSON.parse(decodeURIComponent(option.obj));
			console.log(this.student,'第二传到第三页面的信息')//学生编号
			this.getUserInfo()
			this.getCourseList()
			this.getOrderWayList()
			this.getStudentId()
			this.getCoursePrice(this.order.courseId);
		},
		methods: {
			getStudentId(){
				uni.getStorage({
					key:"studentId",
					success:(res) => {
						console.log(res.data,'3333333333')
						this.order.studentId = res.data//拿到缓存学生Id
					}
				})
			},
			submit(){//确认报名
				//提交订单之后清空 学生Id缓存，其他不能清
				console.log(this.order)
				
				const order=this.order
				const data={
					orderAmount:order.orderPrice,
					wayAmount:order.wayPrice,
					courseId:order.courseId,
					wayId:order.wayId,
					userId:order.userId,
					studentId:order.studentId,
				}
				addYsOrder(data).then(res=>{
					console.log(res)
					if(res.code===200){
						uni.showModal({
						    title: '提示',
						    content: '课程办理成功!是否现在返回我的页面?',
						    success: function (res) {
						        if (res.confirm) {
						            console.log('用户点击确定');
												uni.navigateTo({
													url: "../guwen"
												})
						        } else if (res.cancel) {
						            console.log('用户点击取消');
						        }
						    }
						});
						console.log();
						uni.removeStorageSync('studentId');//清空存储的学生ID
					}
				})
			},
			getUserInfo(){
				uni.getStorage({
					key:"userInfo",
					success: (res) => {
						console.log(res.data.userId,'用户信息')
						this.order.userId = res.data.userId//--------------------------------用户id
					}
				})
			},
			getCourse(e) {//获得课程
				//console.log('picker发送选择改变，携带值为', e.target.value)   用于输出改变索引值
				this.index = e.target.value			//将数组改变索引赋给定义的index变量
				this.jg=this.array[this.index]		//将array【改变索引】的值赋给定义的jg变量
			//	console.log("籍贯为：",this.jg)		//输出获取的籍贯值，例如：中国
				console.log(this.jg,this.index+1)
				this.order.courseId = this.index+1//-------------------------------------------订单课程ID
				if(this.index!=null){						
						this.getCoursePrice(this.index+1);
				}
			},
			getCoursePrice(val){
				getCourseById(val).then(res=>{
					console.log(res.data.coursePrice,'课程信息')
					this.course.coursePrice = res.data.coursePrice
					this.order.orderPrice = res.data.coursePrice//------------------------------订单金额
					this.order.wayPrice = res.data.coursePrice//--------------------------------支付金额
				})
			},
			getWayName:function(e){
				this.indexWayName = e.target.value
				this.wayName=this.arrayWayName[this.indexWayName]
				console.log(this.wayName,this.indexWayName+1)
				this.order.wayId = this.indexWayName+1//-----------------------------------------支付方式ID
			},
			getCourseList(){//加载所有课程信息
				getAllCourse().then(res=>{
					console.log(res.data)
					this.array = res.data.map(function(i){
						return i.courseName
					})
				})
			},
			getOrderWayList(){//加载所有订单支付方式信息
			getAllOrderWay().then(res=>{
				this.arrayWayName = res.data.map(function(i){
					return i.wayName
				})
			})
			}
		}
	}
</script>

<style scoped>
	#content {
		background-color: #F5F5F5;
	}
.picker{
	display: flex;
	margin-left: 40px;
}
	.steps {
		margin-top: 18px;
	}
input{
	font-size:20px;
	margin-left:20rpx ;
}
</style>
